/**
 * 获取订单属性
 * 通过点击样式有.getAttr的按钮来触发事件, 根据按钮中的rel属性add, buy确定下一步动作
 * @auth freeflowf@gmail.com
 */
document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"/mmoMall/js/colorbox/colorbox.css\" />");//colorbox css file
document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"/mmoMall/js/getAttr.css\" />");//get attr css file
var formData = "";//form data
var get_attr_url = "/mmoMall/order/getAttr";//get order attr url
var add_cart_url = "/mmoMall/order/addCart";//add to cart url
var cart_url = "/mmoMall/order/cart";//cart url
$(function(){
    $.getScript("/mmoMall/js/colorbox/jquery.colorbox-min.js");
    
    $(".getAttr").click(function(event){
        var top=event.clientY-100;
        var html = '';
        var form = $(this).parents("form").serializeArray();
        formData = $(this).parents("form").serialize();
        var go = true;
        var action = $(this).attr('rel');
        var product_type='';

        $.each(form, function(i, n){
            if(n.value==""){
                $.colorbox({
                    html:'<div class="empty-message"><h1 style="margin-top:30px;">Please Select Product!</h1></div>', 
                    opacity:0.4, 
                    top:top
                });
                go = false;
                return false;
            }
            switch(n.name){
                case 'product_type':
                    product_type = n.value;
                    break;
            }
            
        });
        
        if(go){
            html = '<div class="attr-box"><h1>Delivery Information</h1><ul class="attr-list">';
            $.post(get_attr_url, formData, function(data){
                html += '<li style="margin-bottom:20px;"><div style="float:left;"><b>'+data.product.name+'</b><div style="font-size:14px;">'+data.product.summary+'</div></div><div class="price">'+data.product.price+'</div><div style="clear:both;"></div></li>';
                var height=300;
                $.each(data.attrs, function(i, n){
                    html += '<li><label>'+n.name+':</label> <input type="text" name="Attr['+n.id+']" /></li>';
                    height +=60;
                });
                
                var options = "";
                for(i=1;i<=10;i++){
                    options += '<option value="'+i+'">'+i+'</option>';
                }
                if(product_type=='GOLD'){
                    html += '<li><label>Quantity: </label> <select class="product-num" name="num">'+options+'</select></li>';
                }else{
                    height -= 50;
                }
                
                html += '<li class="li-button"><button class="btn" type="button" onclick="submitAttr(this, \'' + action + '\')">Submit</button></li></ul><div id="attr-error"></div></div>'
                $.colorbox({
                    html:html,
                    opacity:0.4
                    //top:top,
                    //height:height
                });
            }, "json");
            
        }
        
    });
    
});

function submitAttr(obj, action){
    var checkAttr = true;//check order attr
    $.each($(obj).parents('ul').find('input'), function(i, n){
        if($(n).val() == ""){
            checkAttr = false;
            return false;
        }
    });
    if(checkAttr==false){
        $("#attr-error").html("*Please check you enter.");
    }else{
        var inputAttr = $(obj).parents('ul').find(':input').serialize();
        $("div.attr-box").html('<h1 style="font-size:30px;">Sending...</h1>');
        $.colorbox.resize();
        $.post(add_cart_url, formData+"&"+inputAttr, function(data){
            if(data==200){
                switch(action){
                    case 'add':
                        var c_num = $("#cart_number").html();//cart num
                        $("#cart_number").html(Number(c_num)+1);
                        
                        $("div.attr-box").html('<h1 style="font-size:30px;">Your products have been add to cart!</h1><ul class="attr-list"><li class="li-button"><a href="javascript:void(0)" class="btn" onclick="$.colorbox.close()">Continue shopping</a> <a class="btn btn-primary" href="' + cart_url + '">Check Out</a></li></ul>');
                        $.colorbox.resize();
                        //setTimeout("$.colorbox.close()", 1500);
                        break;
                    case 'buy':
                        location.href = cart_url;
                        break;
                }
            }
                    
        });
        
    }
}

